<!--部门-->
<template>
  <div style="background:#ffffff;">
    <div>
      <el-row class="top_row">
        <el-col :span="24">
          <div class="top_title">
            <div class="left_add">
              <el-button
                type="info"
                @click="$router.push('/User/DepartmentEdit')"
                size="mini"
                icon="el-icon-circle-plus">新增
                </el-button>
            </div>
            <div class="right_sel">
              <el-input size="mini" v-model="SelName" placeholder="查找...">
                <el-button slot="append" @click="SelDt" icon="el-icon-search" style="width:50px;"></el-button>
              </el-input>
            </div>
          </div>
        </el-col>
      </el-row>
    </div>
    <hr />
    <el-table :data="UserInfo" ref="DepartmentEdit" style="width: 100%;">
      <el-table-column prop="pk_Department" label="ID" width="100"></el-table-column>
      <el-table-column prop="DepartmentName" label="名称" width="180"></el-table-column>
      <el-table-column prop="Fax" label="电话" width="300"></el-table-column>
      <el-table-column prop="Email" label="邮箱" width="300"></el-table-column>
      <el-table-column prop="LevelID" label="排序" width="180"></el-table-column>
      <el-table-column fixed="right" label="操作" min-width="200" align="center">
        <template slot-scope="scope">
          <el-button @click="handleClick(scope.row.pk_Department)" type="primary" class="el-icon-edit-outline" size="mini">修改</el-button>
           <el-popconfirm @onConfirm="Delete(scope.$index,scope.row.pk_Department)" style="margin-left:10px;"
                  :title="'确定删除此'+scope.row.DepartmentName+'?'">
                  <el-button slot="reference" type="danger" size="mini" icon="el-icon-delete">删除</el-button>
            </el-popconfirm>
          <!--<el-button size="mini" type="danger" class="el-icon-delete" @click="Delete(scope.row.pk_Department)">删除</el-button>-->
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<style lang="scss" scoped>
.top_row {
  border-bottom: 1px solid #f7f7f7;
  padding-bottom: 10px;
  .top_title {
    .left_add {
      float: left;
    }
    .right_sel {
      float: right;
    }
  }
}
</style>
<script>
export default {
  data() {
    return {
      UserInfo: [],
      SelName:""
    }
  },
  mounted() {
    this.SelDt()
  },
  methods: {
    SelDt() {
      //模糊查询
      this.$axios({
        url: "/HrApi/Department/GetUserListInfo",
        method: "GET",
        params: {
          SelName:this.SelName
        },
      }).then((res) => {
        if (!res.data.code) {
          this.UserInfo = res.data.data;
        } else {
          this.$message.error(res.data.msg);
        }
      });
      },
      handleClick(id){
      this.$router.push({
          path: "/User/DepartmentEdit",
          query: {
          id : id
        }
         })
      },
      Delete(index,pk_Department){
       this.$axios({
        url: '/HrApi/Department/DeleteDepartment',
        method: 'POST',
        data: this.$Qs.stringify({
            pk_Department:pk_Department,
            pk_User:this.$store.state.UserInfo.pk_User
          })
      }).then(res => {
        if (!res.data.code) {
          this.$message.success(res.data.msg)
          this.SelDt();
        } else {
          this.$message.error(res.data.msg)
        }
      })
      }
  },
  watch: {
    //侦听模糊查询，如果为空自动显示所有数据
    SelName(n) {
      if (n === "") {
        this.SelDt();
      }
    }
  }
}
</script>

